<%@ page language="java" import="java.util.*" pageEncoding="utf-8" %>
<%@include file="/commons/taglibs.jsp" %>
<!DOCTYPE html>
<html>
<fmt:bundle basename="res">
<head>
    <meta charset="utf-8">
    <title><fmt:message key='lb'/></title>
    <jsp:include page="/WEB-INF/commons/commons-header.jsp" flush="true"/>
</head>
<body>

<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-form layui-card-header layuiadmin-card-header-auto">

            <div class="layui-form-item">
                <form name="totalForm" id="totalForm" action="${web_domain}/mall/goods/list" method="get">

                    <div class="layui-inline">
                        <label class="layui-form-label"><fmt:message key='spmc'/></label>
                        <div class="layui-input-inline">
                            <input type="text" name="name" placeholder="<fmt:message key='qsrspmc'/>" value="<c:if test='${params.name !=null}'>${params.name}</c:if>" autocomplete="off" class="layui-input">
                        </div>
                    </div>

                    <div class="layui-inline">
                        <label class="layui-form-label"><fmt:message key='spbh'/></label>
                        <div class="layui-input-inline">
                            <input type="text" name="goodsNo" placeholder="<fmt:message key='qsrspmc'/>" value="<c:if test='${params.goodsNo !=null}'>${params.goodsNo}</c:if>" autocomplete="off" class="layui-input">
                        </div>
                    </div>

                    <div class="layui-inline">
                        <label class="layui-form-label"><fmt:message key='splm'/></label>
                        <div class="layui-input-inline">

                            <select lay-verify="required" id="topChannel" lay-filter="topChannel" name="goodsChannel.parent.parent.id">
                                <option value="0"><fmt:message key='qxz'/></option>
                                <c:forEach items="${channels }" var="item">
                                    <option value="${item.id}"
                                            <c:if test="${item.id eq params.goodsChannel.parent.parent.id}">selected="selected"</c:if> >${item.name}</option>
                                </c:forEach>
                            </select>

                        </div>

                        <div class="layui-input-inline middleChannel">
                            <select lay-verify="required" id="middleChannel" lay-filter="middleChannel" name="goodsChannel.parent.id">
                                <option value="0"><fmt:message key='qxz'/></option>
                                <c:forEach items="${params.goodsChannel.parent.parent.children }" var="item">
                                    <option value="${item.id}"
                                            <c:if test="${item.id eq params.goodsChannel.parent.id}">selected="selected"</c:if> >${item.name}</option>
                                </c:forEach>
                            </select>
                        </div>

                        <div class="layui-input-inline bottomChannel">
                            <select lay-verify="required" name="goodsChannel.id" id="bottomChannel" lay-filter="bottomChannel">
                                <option value="0"><fmt:message key='qxz'/></option>
                                <c:forEach items="${params.goodsChannel.parent.children }" var="item">
                                    <option value="${item.id}"
                                            <c:if test="${item.id eq params.goodsChannel.id}">selected="selected"</c:if> >${item.name}</option>
                                </c:forEach>
                            </select>
                        </div>

                    </div>

                    <div class="layui-inline">
                        <label class="layui-form-label"><fmt:message key='sssj'/></label>
                        <div class="layui-input-inline">
                            <select name="merchant.id" lay-verify="required" lay-search="">
                                <option value="0"><fmt:message key='zjxzhssxz'/></option>
                                <c:forEach items="${merchants}" var="merchant">
                                    <option value="${merchant.id}" <c:if test="${merchant.id eq params.merchant.id}">selected="selected" </c:if>>${merchant.shopName}</option>
                                </c:forEach>
                            </select>

                        </div>
                    </div>

                    <!-- 需要排序的字段 -->
                    <input type="hidden" class="feijin-orderby" name="orderByCreateTime" id="orderByCreateTimeParams" value="${params.orderByCreateTime}"/>
                    <input type="hidden" class="feijin-orderby" name="orderByStore" id="orderByStoreParams" value="${params.orderByStore}"/>
                    <input type="hidden" class="feijin-orderby" name="orderByPrice" id="orderByPriceParams" value="${params.orderByPrice}"/>
                    <input type="hidden" class="feijin-orderby" name="orderBySalesVolume" id="orderBySalesVolumeParams" value="${params.orderBySalesVolume}"/>
                    <!-- 需要排序的字段 -->
                    <input type="hidden" name="status" value="${params.status}" />

                    <div class="layui-inline">
                        <button class="layui-btn layui-btn-sm layuiadmin-btn-list" id="search"><i class="layui-icon layui-icon-search layuiadmin-button-btn"></i> <fmt:message key='ss'/></button>
                    </div>
                </form>
            </div>
        </div>

    </div>

    <div class="layui-card">
        <div class="layui-field-box layui-form">

            <a href="javascript:void(0);" class="layui-btn layui-btn-sm layui-btn-warm" id="allRecommend"><i class="layui-icon">&#xe605;</i> <fmt:message key='pltj'/></a>
            <a href="javascript:void(0);" class="layui-btn layui-btn-sm layui-btn-danger" id="allUnRecommend"><i class="layui-icon">&#x1006;</i> <fmt:message key='plqxtj'/></a>


            <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
                <ul class="layui-tab-title">
                    <li <c:if test="${params.status eq 0}">class="layui-this"</c:if> >
                        <a href="${web_domain}/mall/goods/list" <c:if test="${params.status eq 0}">style="color: rgb(0, 150, 136)"</c:if> ><fmt:message key='qb'/></a>
                    </li>
                    <li <c:if test="${params.status eq 3}">class="layui-this"</c:if>>
                        <a href="${web_domain}/mall/goods/list?status=3" <c:if test="${params.status eq 3}">style="color: rgb(0, 150, 136)"</c:if>><fmt:message key='xsz'/></a>
                    </li>
                    <li <c:if test="${params.status eq 6}">class="layui-this"</c:if>>
                        <a href="${web_domain}/mall/goods/list?status=6" <c:if test="${params.status eq 6}">style="color: rgb(0, 150, 136)"</c:if>><fmt:message key='ysx'/></a>
                    </li>
                </ul>
            </div>

            <table class="layui-table layui-form" lay-size="sm">
                <thead>
                <th width="5%"><input id="checkboxs" type="checkbox" value="${item.id}" lay-ignore lay-skin="primary"/></th>
                <th><fmt:message key='spbh'/></th>
                <th><fmt:message key='spfm'/></th>
                <th width="30%"><fmt:message key='spmc'/></th>
                <th><fmt:message key='spfl'/></th>
                <th id="orderByPrice">
                    <span><fmt:message key='spje'/></span>
                    <span class="layui-table-sort layui-inline" lay-sort="${params.orderByPrice}"><i class="layui-edge layui-table-sort-asc" title="<fmt:message key='sx1'/>"></i><i class="layui-edge layui-table-sort-desc" title="<fmt:message key='jx'/>"></i></span>
                </th>
                <th id="orderByStore">
                    <span><fmt:message key='zkc'/></span>
                    <span class="layui-table-sort layui-inline" lay-sort="${params.orderByStore}"><i class="layui-edge layui-table-sort-asc" title="<fmt:message key='sx1'/>"></i><i class="layui-edge layui-table-sort-desc" title="<fmt:message key='jx'/>"></i></span>
                </th>
                <th id="orderBySalesVolume">
                    <span><fmt:message key='xl'/></span>
                    <span class="layui-table-sort layui-inline" lay-sort="${params.orderBySalesVolume}"><i class="layui-edge layui-table-sort-asc" title="<fmt:message key='sx1'/>"></i><i class="layui-edge layui-table-sort-desc" title="<fmt:message key='jx'/>"></i></span>
                </th>
                <th><fmt:message key='sj'/></th>
                <th><fmt:message key='tjsy'/></th>
                <th><fmt:message key='zt'/></th>
                <th><fmt:message key='cz'/></th>
                </thead>
                <c:forEach items="${page.result}" var="item" varStatus="status">
                    <tr>
                        <td><input type="checkbox" value="${item.id}" class="feijin-check" lay-ignore lay-skin="primary"/></td>
                        <td>${item.goodsNo }</td>
                        <td><img class="preview" style="width:40px;height:40px;" src="${store_domain}/uploads/${item.defaultImage}"/></td>
                        <td>${item.name }</td>
                        <td>${item.goodsChannel.name}</td>
                        <td><fmt:formatNumber value="${item.defaultPrice}" type="CURRENCY"/></td>
                        <td>${item.store}</td>
                        <td>${item.salesVolume}</td>
                        <td>${item.merchant.shopName}</td>
                        <td>
                            <input type="checkbox" name="recommend" lay-filter="recommend" data-id="${item.id}" lay-skin="switch" lay-text="<fmt:message key='s|f'/>" <c:if test="${item.recommend}">checked</c:if>>
                        </td>
                        <td>
                            <c:choose>
                                <c:when test="${item.status eq 1}"><fmt:message key='dsj'/></c:when>
                                <c:when test="${item.status eq 2}"><fmt:message key='shz'/></c:when>
                                <c:when test="${item.status eq 3}"><fmt:message key='xsz'/></c:when>
                                <c:when test="${item.status eq 4}"><fmt:message key='shbtg'/></c:when>
                                <c:when test="${item.status eq 5}"><fmt:message key='yxj'/></c:when>
                                <c:when test="${item.status eq 6}"><fmt:message key='ysx'/></c:when>
                            </c:choose>
                        </td>
                        <td>
                            <div class="layui-btn-container">
                                <c:if test="${item.status eq 2}">
                                    <a href="javascript:void(0);" data-id="${item.id}" class="layui-btn layui-btn-xs feijin-modify"><fmt:message key='bj'/></a>
                                </c:if>
                                <a href="javascript:void(0);" data-id="${item.id}" class="layui-btn layui-btn-xs feijin-detail"><fmt:message key='ck'/></a>
                                <a href="javascript:void(0);" data-url="pages/index/goodsDetail/goodsDetail?id=${item.id}" class="layui-btn layui-btn-xs copy-url"><fmt:message key='fzlj'/></a>
                            </div>
                        </td>
                    </tr>
                </c:forEach>
            </table>
            <jsp:include page="/commons/page.jsp" flush="true"/>
        </div>
    </div>

</div>

<script>

    $(function () {

        $(".copy-url").click(function () {
            var url = $(this).attr("data-url");
            var transfer = $("<input type='text' id='copy_text'>");
            $("body").append(transfer);
            transfer.val(url)
            transfer.focus();
            transfer.select();
            document.execCommand('Copy', false, null);
            $('#copy_text').remove();
            layer.msg("<fmt:message key='fzcg'/>");
        });

        //全选反选
        $("#checkboxs").click(function () {
            if (this.checked) {
                $(".feijin-check:checkbox").prop("checked", true);
            } else {
                $(".feijin-check:checkbox").prop("checked", false);
            }
        });

        //批量推荐到首页
        $("#allRecommend").click(function () {
            var ids = [];

            $(".feijin-check:checkbox:checked").each(function (index, item) {
                var id = $(item).val();
                ids.push(id);
            });

            if (ids.length == 0) {
                layer.msg('<fmt:message key='qxgxxyczdjl'/>');
                return false;
            }

            layer.open({
                content: '<fmt:message key='qryjxzdspqbtjdsym?'/>'
                , btn: ['<fmt:message key='qd'/>', '<fmt:message key='qx'/>']
                , yes: function (index, layero) {
                    $.ajax({
                        url: "${web_domain}/mall/goods/allRecommend",
                        type: "post",
                        dataType: "json",
                        data: {
                            "ids": ids.join(";"),
                            "_method": "put"
                        },
                        success: function (result) {
                            if (result.status) {
                                location.reload();
                            }
                        }
                    });
                }
            });
        });


        //批量取消推荐到首页
        $("#allUnRecommend").click(function () {
            var ids = [];

            $(".feijin-check:checkbox:checked").each(function (index, item) {
                var id = $(item).val();
                ids.push(id);
            });

            if (ids.length == 0) {
                layer.msg('<fmt:message key='qxgxxyczdjl'/>');
                return false;
            }

            layer.open({
                content: '<fmt:message key='qryjxzdspqbqxtjdsym?'/>'
                , btn: ['<fmt:message key='qd'/>', '<fmt:message key='qx'/>']
                , yes: function (index, layero) {
                    $.ajax({
                        url: "${web_domain}/mall/goods/allUnRecommend",
                        type: "post",
                        dataType: "json",
                        data: {
                            "ids": ids.join(";"),
                            "_method": "put"
                        },
                        success: function (result) {
                            if (result.status) {
                                location.reload();
                            }
                        }
                    });
                }
            });
        });

        layui.use(['form', 'laydate'], function () {

            var form = layui.form;
            var laydate = layui.laydate;
            form.on('switch(recommend)', function (data) {
                var checked = data.elem.checked;
                var id = $(data.elem).attr("data-id");

                feijin.put({
                    url: "${web_domain}/mall/goods/recommend",
                    data: {"id": id, "recommend": checked},
                    success:function(result) {
                        if(result.status) {
                            layer.msg("<fmt:message key='cg'/>");
                        }
                    }
                });

            });



            //加载二级商品类目
            form.on('select(topChannel)', function (data) {
                if (data.elem != data.value) {
                    var id = $("#topChannel").val();
                    $(".middleChannel").html("");
                    $(".bottomChannel").html("");

                    $.ajax({
                        url: "${web_domain}/mall/goods/childChannels?id=" + id,
                        type: "get",
                        dataType: "JSON",
                        success: function (result) {
                            if (result.status && result.result != null) {
                                var channelsHTML = "<select lay-verify='required' id='middleChannel' class='layui-input' lay-filter='middleChannel' name='goodsChannel.parent.id'>" +
                                        "<option value='0'><fmt:message key='qxz'/></option>";
                                $.each(result.result, function (index, item) {
                                    channelsHTML += "<option value='" + item.id + "' >" + item.name + "</option>"
                                });
                                channelsHTML += "</select>";

                                $(".middleChannel").html(channelsHTML);
                                form.render('select');//重新渲染
                            }
                        }
                    });
                }
            });

            //加载三级商品类目
            form.on('select(middleChannel)', function (data) {
                if (data.elem != data.value) {
                    var id = $("#middleChannel").val();
                    $(".bottomChannel").html("");

                    $.ajax({
                        url: "${web_domain}/mall/goods/childChannels?id=" + id,
                        type: "get",
                        dataType: "JSON",
                        success: function (result) {
                            if (result.status && result.result != null) {
                                var channelsHTML = "<select lay-verify='required' name='goodsChannel.id' id='bottomChannel' class='layui-input' lay-filter='bottomChannel'>" +
                                        "<option value='0'><fmt:message key='qxz'/></option>";
                                $.each(result.result, function (index, item) {
                                    channelsHTML += "<option value='" + item.id + "' >" + item.name + "</option>"
                                });
                                channelsHTML += "</select>";
                                $(".bottomChannel").html(channelsHTML);
                                form.render('select');//重新渲染
                            }
                        }
                    });
                }
            });

        });

        //编辑
        $(".feijin-modify").click(function () {

            var id = $(this).attr("data-id");

            layer.open({
                type: 2
                , title: '<fmt:message key='bjsp'/>'
                , content: '${web_domain}/mall/goods/' + id + '/modify'
                , maxmin: true
                , area: ['97%', '97%']
                , btn: ['<fmt:message key='bc'/>', '<fmt:message key='qx'/>']
                , yes: function (index, layero) {
                    var submit = layero.find('iframe').contents().find("#submit");
                    submit.click();
                }
            });
        });

        //查看详情
        $(".feijin-detail").click(function () {

            var id = $(this).attr("data-id");

            layer.open({
                type: 2
                , title: '<fmt:message key='ckxq'/>'
                , content: '${web_domain}/mall/goods/' + id + '/detail'
                , maxmin: true
                , area: ['97%', '97%']
                , btn: ['<fmt:message key='fh'/>']
            });
        });

        //按时间排序
        $("#orderByCreateTime").click(function () {
            $(".feijin-orderby").attr("value", "");
            var orderBy = "${params.orderByCreateTime}";

            if (orderBy == "asc") {
                $("#orderByCreateTimeParams").attr("value", "");
                $("#search").click();
                return;
            }

            if (orderBy == "desc") {
                $("#orderByCreateTimeParams").attr("value", "asc");
                $("#search").click();
                return;
            }

            if (orderBy == "") {
                $("#orderByCreateTimeParams").attr("value", "desc");
                $("#search").click();
                return;
            }
        });

        //按价格排序
        $("#orderByPrice").click(function () {
            $(".feijin-orderby").attr("value", "");
            var orderBy = "${params.orderByPrice}";

            if (orderBy == "asc") {
                $("#orderByPriceParams").attr("value", "");
                $("#search").click();
                return;
            }

            if (orderBy == "desc") {
                $("#orderByPriceParams").attr("value", "asc");
                $("#search").click();
                return;
            }

            if (orderBy == "") {
                $("#orderByPriceParams").attr("value", "desc");
                $("#search").click();
                return;
            }
        });

        //按库存排序
        $("#orderByStore").click(function () {
            $(".feijin-orderby").attr("value", "");
            var orderBy = "${params.orderByStore}";

            if (orderBy == "asc") {
                $("#orderByStoreParams").attr("value", "");
                $("#search").click();
                return;
            }

            if (orderBy == "desc") {
                $("#orderByStoreParams").attr("value", "asc");
                $("#search").click();
                return;
            }

            if (orderBy == "") {
                $("#orderByStoreParams").attr("value", "desc");
                $("#search").click();
                return;
            }
        });

        //按销量排序
        $("#orderBySalesVolume").click(function () {
            $(".feijin-orderby").attr("value", "");
            var orderBy = "${params.orderBySalesVolume}";

            if (orderBy == "asc") {
                $("#orderBySalesVolumeParams").attr("value", "");
                $("#search").click();
                return;
            }

            if (orderBy == "desc") {
                $("#orderBySalesVolumeParams").attr("value", "asc");
                $("#search").click();
                return;
            }

            if (orderBy == "") {
                $("#orderBySalesVolumeParams").attr("value", "desc");
                $("#search").click();
                return;
            }
        });


    });
</script>
</body>
</fmt:bundle>
</html>
